ui|splitbox, ui|splitpanel {
    display: block;
    position: relative;
    overflow: hidden;

    &.maximized {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

ui|splitbox {
    height: 100%;

    &.line {
        ui|splitter.horizontal ui|splitterbody:after {
            content: '';
            position: absolute;
            border-left: 1px solid @base-border-color;
            height: 100%;
            width: 0px;
            top: 0px;
            left: 4px;
        }
    }
}

ui|splitpanel {
    &.horizontal {
        float: left;
    }

    &.maximized {
        float: none !important;
    }
}

ui|splitter {
    display: block;
    z-index: 2;
    position: relative;
    background: transparent;
    font-size: 1px;

    &.active {
        z-index: 23; /* float to top while dragging */
    }

    &.horizontal {
        height: 100%;
        width: 4px;
        float: left;
        border: 0px;
        margin: 0 -4px;

        ui|splitterbody {
            width: 4px;
            height: 100%;
            margin-left: -1px;
            cursor: e-resize;

            &.hover, &.active {
                box-shadow: 2px 0 3px rgba(0,0,0,0.35);
            }
        }
    }

    &.vertical {
        height: 4px;
        width: 100%;
        border-bottom: 1px solid @base-border-color;
        border-top: 1px solid @base-border-color;

        ui|splitterbody {
            height: 4px;
            width: 100%;
            cursor: n-resize;
            margin-top: -1px;

            &.hover, &.active {
                vendor-box-shadow: 0 2px 3px rgba(0,0,0,0.35);
            }
        }
    }
}

ui|splitterbody {
    display: block;
    position: absolute;
    background: transparent;
}

ui|stagesplitterbody {
    background-color: #fff;
    width: 10px;
    height: 10px;
    overflow: hidden;
    position: absolute;
    display: none;
    z-index: 4; /* above views (firefox3 alpha needs them +2 above) */
    &.horizontal {
        border-left: 1px solid @base-border-color;
        border-right: 1px solid @base-border-color;
        box-shadow: 2px 0 3px rgba(0,0,0,0.35);
        cursor: e-resize;
    }

    &.vertical {
        border-top: 1px solid @base-border-color;
        border-bottom: 1px solid @base-border-color;
        box-shadow: 0 2px 3px rgba(0,0,0,0.35);
        cursor: n-resize;
    }
}

.stagesplittercover {
    z-index: 5; /* above stagesplitterbody */
}

#toolsplitpanel {
    margin-right: -1px; // fix bug when ZOOM browser
}
